<template>
    <view class="ctn">
        <view class="main">
            <view class="li-img">
                <image
                    src="../../static/financialImg/payYes.png"
                    mode=""
                    class="yesImg"
                ></image>
                <text class="pay-state">购买成功</text>
                <view
                    >将于<text class="pay-time">{{date[0]}}年{{date[1]}}月{{date[2]*1+2}}日</text
                    >开始计算收益</view
                >
            </view>
            <view class="btn">
                <view
                    class="left"
                    :class="{ active: item.show }"
                    v-for="item in btns"
                    :key="item.id"
                    @tap="runPath(item.id)"
                    >{{ item.name }}</view
                >
            </view>
        </view>
    </view>
</template>

<script>
export default {
    data() {
        return {
            btns: [
                {
                    id: 1,
                    name: "再去逛逛",
                    show: false,
                },
                {
                    id: 2,
                    name: "查看我的资产",
                    show: true,
                },
            ],
			date:``
        };
    },
	onLoad(){
		this.date= new Date().toISOString().slice(0, 10).split(`-`)
		console.log(this.date)


	},
    methods: {
        runPath(id) {
            this.btns = this.btns.map((item) => {
                if (item.id == id) {
                    item.show = true;
                    return item;
                } else {
                    item.show = false;
                    return item;
                }
            });
            if (id == 2) {
                uni.navigateTo({
                    url: "../myAssets/myAssets",
                });
            } else if (id == 1) {
                console.log(`跳转到对应的商品（基金，货币）详情`);
                // 跳转到基金
				// uni.redirectTo({
				// 	url:"../payFinancial/payFinancial"
				// })
                uni.switchTab({
                	url:"../wealth/wealth",
                	complete() {

                	},
                	fail(erro) {
                		console.log(erro);
                	}
                })
            }
        },
        try() {
            console.log(`ddddddd`);
        },
		
    },
};
</script>

<style lang="scss" scoped>
* {
    box-sizing: border-box;
}
.ctn {
    height: 80vh;
    width: 100vw;
    box-sizing: border-box;
    // border: 1px solid red;
    padding: 200rpx 70rpx;
}
.main {
    display: flex;
    flex-direction: column;
    align-items: center;
    // margin-top: 200rpx;
    // padding: 0 70rpx;
    box-sizing: border-box;
    // border: 1px solid red;
    .li-img {
        display: flex;
        flex-direction: column;
        align-items: center;
        font-size: 28rpx;
        color: #666;

        .pay-state {
            margin-top: 50rpx;
            margin-bottom: 30rpx;
            font-weight: bold;
            font-size: 32rpx;
            color: rgb(0, 0, 0);
        }

        .yesImg {
            width: 120rpx;
            height: 120rpx;
        }

        .pay-time {
            color: #3476f1;
        }
    }

    .btn {
        width: 100%;
        margin-top: 134rpx;
        display: flex;
        justify-content: space-between;

        .left,
        .right {
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 28rpx;
            color: #666;
            width: 290rpx;
            height: 88rpx;
            border: 2rpx solid #ccc;
            border-radius: 4rpx;
        }

        .active {
            border: 2rpx solid #3476f1;
        }
    }
}
</style>
